<template>
    <div>
        <el-form style="width:80vw" label-position="right" label-width="80px" :model="data" ref="complaints_ref"
            :rules="rules">
            <el-form-item label="标题" prop="title">
                <el-input v-model="data.title"></el-input>
            </el-form-item>
            <el-form-item label="投诉对象" prop="compalint_enterprise">
                <!-- <el-input v-model="data.enterprise_id"></el-input> -->
                <el-select v-model="data.enterprise_id" placeholder="请选择投诉对象">
                    <el-option v-for="item in enterprise_options" :key="item.name" :label="item.name" :value="item.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="服务评分" prop="level">
                <el-rate v-model="data.level" style="line-height:40px">
                </el-rate>

            </el-form-item>
            <el-form-item label="问题描述" prop="information">
                <el-input type="textarea" :rows="10" v-model="data.content"></el-input>
            </el-form-item>
        </el-form>
        <div class="btn">
            <el-button type="primary" class="next_btn" size="medium" @click="() => $emit('pre_step', true)">
                <i class="el-icon-back"></i> 上一步
            </el-button>
            <el-button type="primary" class="next_btn" size="medium" @click="submit_complaints">
                提交 <i class="el-icon-right"></i>
            </el-button>
        </div>
    </div>
</template>

<script>
import { rules } from '@/utils/rules'
export default {
    data() {
        return {
            data: {
                id: 1,
                title: '',
                sender: sessionStorage.user_id,
                enterprise_id: null,
                content: '',
                level: 0,
                send_date: this.$moment().format('YYYY-MM-DD'),
                if_coped: 0,
            },
            rules: null,
            enterprise_options: [],
        }
    },

    mounted() {
        this.rules = rules
        this.get_all_enterprise()
    },

    methods: {

        async get_all_enterprise() {
            try {
                const res = await this.$http.get("/selectAllTourismEnterprise");
                // // console.log(res)
                this.enterprise_options = res.data.data
            } catch (error) { }
        },

        async submit_complaints() {
            // console.log(this.data)
            const res = await this.$http.post("/AddComplaint", {
                sender: sessionStorage.user_id,
                enterprise_id: this.data.enterprise_id,
                content: this.data.content,
                level: this.data.level,
                if_coped: 0,
                send_date: this.$moment().format('YYYY-MM-DD'),
                title: this.data.title
            });

            if (res.data.code === 2000 && res.data.data === 1) {
                this.$message.success('成功')
                this.$emit('next_step', true)
            } else {
                this.$message.success('失败')
            }
        }
    },
}
</script>

<style lang="less" scoped>
.btn {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 30%);
}

.next_btn {
    margin: 0 auto;
    height: 40px
}
</style>